.webview {
    font-size: 15px;

    &.light {
        .line {
            background-color: #e9e9e9;
        }

        .menu-item {
            color: #333 !important;

            &:hover {
                color: #000 !important;
            }
        }

        .doc {
            .block {
                background-color: #fff !important;
                color: #000;
            }
        }
    }

    .line {
        background-color: #393939;
        height: 1px;
    }

    .user {
        min-width: 240px;
        display: flex;
        align-items: center;

        .menu {
            display: flex;
            align-items: center;
            flex: 1;

            >div {
                &:nth-child(1) {
                    flex: 1;
                    display: flex;
                    align-items: center;

                    >div {
                        padding: 16px 0;
                        border-bottom: solid 4px transparent;

                        &:nth-child(n+2) {
                            margin-left: 16px;
                        }

                        &.active {
                            color: #fff;
                            border-color: #2f73cc;
                        }

                        &:hover {
                            cursor: pointer;
                            color: #fff;
                        }
                    }
                }

                &:nth-child(2) {
                    >span {
                        padding-right: 8px;
                        border-right: solid 1px #393939;
                    }
                }
            }
        }

        .user-name {
            display: flex;
            align-items: center;

            >span {
                &:nth-child(1) {
                    margin: 0 4px 0 8px;
                }
            }


            .login {
                &:hover {
                    cursor: pointer;
                }
            }
        }
    }

    .container {
        padding: 16px 0;
    }
}